let bar1 = echarts.init(document.getElementById('bar'));
let option_bar1;
let cli_back = document.getElementById('back');
$('#back').hide();//隐藏返回图标

function back_method(){//返回国内省份数据
    pname = 'p';
    getCityToday();
}
cli_back.addEventListener("click", back_method,false);//创建监听事件，监听返回点击事件

option_bar1 = {
    title:{
        text: '国内各地',
        left: 'left'
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },

    toolbox: {
        left: '80%',
        feature: {
            dataView: {show: true, readOnly: true},
            magicType: {show: true, type: ['line', 'bar']},
            restore: {show: true, title: '返回初始状态'},
            saveAsImage: {show: true}
        }
    },

    legend: {
        left: 'center',
        selectedMode: 'single',
        data: ['累计确诊', '累计治愈', '累计死亡', '现存确诊', '无症状', '疑似']
    },

    dataZoom: [{
        type: 'inside',
        fillerColor: "rgba(204, 167, 200, 0.4)"
    },{
        type: 'slider'
    }],

    xAxis:
        {
            type: 'category',
            data: [],
            axisTick: {
                alignWithLabel: true
            },
            axisLabel: {
                rotate: 50,
                interval: 0,
                overflow: "breakAll"
            }
        },
    yAxis: [
        {
            type: 'value',
            realtimeSort: true,
            max: 'dataMax',
        }
    ],
    axisTick: {
      alignWithLabel: true
    },

    series: [
        {
            realtimeSort: true,
            name: '累计确诊',
            type: 'bar',
            barWidth: '50%',
            data: []
        },
        {
            name: '累计治愈',
            type: 'bar',
            barWidth: '50%',
            data: []
        },
        {
            name: '累计死亡',
            type: 'bar',
            barWidth: '50%',
            data: []
        },
        {
            name: '现存确诊',
            type: 'bar',
            barWidth: '50%',
            data: []
        },
        {
            name: '无症状',
            type: 'bar',
            barWidth: '50%',
            data: []
        }
    ]
};

bar1.setOption(option_bar1);

function getCityToday() {
    bar1.showLoading();
    $.ajax({
        type: 'get',
        url: '/getCityDay',
        data: {"pname":pname},
        success: function (cdata) {
            bar1.hideLoading();
            let confirm = JSON.parse(cdata['res'][0]);
            let heal = JSON.parse(cdata['res'][2]);
            let dead = JSON.parse(cdata['res'][3]);
            let nowconfirm = JSON.parse(cdata['res'][1]);
            let noInfect = JSON.parse(cdata['res'][5]);
            if (pname != 'p'){
                option_bar1.title.text = pname;
                $('#back').show();
            }else{
                option_bar1.title.text = '国内各地';
                $('#back').hide();
            }

            option_bar1.xAxis.data = confirm['confirm'][0];
            //console.log(confirm)
            option_bar1.series[0].data = confirm['confirm'][1];
            option_bar1.series[1].data = heal['heal'][1];
            option_bar1.series[2].data = dead['dead'][1];
            option_bar1.series[3].data = nowconfirm['nowconfirm'][1];
            option_bar1.series[4].data = noInfect['noInfect'][1];
            bar1.setOption(option_bar1);//用配置项配置（动词）echarts
        }, error: function () {
            console.log("这个接口挂了");
        }
    })
}

getCityToday()

window.onresize=function(){
   bar1.resize();
};
